<?php
session_start();
// 检查登录状态
if (isset($_SESSION['is_login']) && $_SESSION['is_login'] == 1) {
    $username = $_SESSION['username'];
    $page_visit=$_SESSION['page_visit']; // 页面访问次数
    $user_id = $_SESSION['user_id']; // 假设用户 ID 存储在 session 中
    echo "<div  id='welcomeMsg' >欢迎回来，$username!,您总共访问页面 $page_visit 次                   \t<a href='blog_login.php'>退出登录</a></div>";
    echo "
    <script src='script/autoHide.js'></script>
    <script> initAutoHide({ elementId: 'welcomeMsg',delay: 3000 }); </script>
    ";
    $current_file = basename($_SERVER['PHP_SELF']);
    //echo $current_file; // 输出：index.php
    // 发送请求更新访问次数
    echo "<script>
        var xhr = new XMLHttpRequest();
        xhr.open('POST', 'php/pagevisit.php', true);
        xhr.setRequestHeader('Content-Type', 'application/x-www-form-urlencoded');
        xhr.onreadystatechange = function() {
            if (xhr.readyState === 4 && xhr.status === 200) {
                console.log(xhr.responseText);
            }
        };
        xhr.send('update_page_visit=1&user_id=$user_id&current_file=$current_file');
    </script>";
} else {
    echo "<div id='welcomeMsg' >您尚未登录，请<a href='blog_login.php'>登录</a></div>";
}

?>

<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
    <title>Blog 系统</title>
    <link rel="stylesheet" type="text/css" href="CSS/index.css">

</head>
<body style="background-image: url('image/bg.png');background-size: cover; background-repeat: no-repeat; background-position: center;">
    <!-- 容器 -->
    <div class="container">

        <!-- 顶部导航栏 -->
        <div class="header">
            <div class="logo">
                <img src="image/log.png" alt="Logo" style="height: 20px;">
                <span style="margin-left: 10px;">我的博客</span>
            </div>
            <div >
                <a style="font-size: 14px;" href="#">主页</a>
            </div>
        </div>

        <!-- 主体内容 -->
        <div class="main">
            <!-- 左侧用户信息 -->
            <div class="left" style="display: flex; flex-direction: column; justify-content: center; align-items: center; flex: 1;">
                <img src="image/head.png" alt="用户头像" style="width: 100px; height: 100px; border-radius: 50%;">
                <?php
                    echo '<h3 style="margin-top: 10px;">' . $username . '</h3>';
                    ?>
                <p style="margin: 5px 0;">CSDN 地址: <a href="https://blog.csdn.net/Sean_Hlaw">链接</a></p>
                <p style="margin: 5px 0; word-wrap: break-word; white-space: normal;">个人简介: 前端开发者，热爱技术分享。</p>
            </div>

            <!-- 右侧三个区域 -->
            <div class="right">
                <div class="main_right" > <a href="https://baike.baidu.com/item/%E5%AE%9C%E5%AE%BE%E5%B8%82/13827162" style="text-decoration: none;" >我的家乡宜宾 </a></p>
                    <p style="margin: 5px 0; word-wrap: break-word; white-space: normal;">
                        宜宾位于中国四川省南部，是一座历史悠久的文化名城。它以壮丽的自然风光和丰富的文化遗产闻名，被誉为“万里长江第一城”。
                        宜宾是五粮液的故乡，这里的白酒文化源远流长。此外，宜宾还有蜀南竹海、李庄古镇等著名景点，风景优美，值得一游。
                    </p>
                    <div class="comment-container">
                        <script src="script/onclick.js"></script>
                        <input type="text" id="commentInput" class="input-hidden" placeholder="请输入评论内容" onkeydown="handleKeyDown(event)">
                        <a id="commentButton" onclick="showInput()">评论</a>
                    </div>
                    <!-- 评论展示 -->
                    <div class="comments-container">
                        <a class="comments-display" id="commentsDisplay"></a>
                    </div>
                    
                </div>
                <div class="main_right" >我的家庭
                    <p style="margin: 5px 0; word-wrap: break-word; white-space: normal;">
                        我来自一个普通的家庭，父母都是普通的工人。他们辛勤工作，为了我们的成长和幸福而努力。我非常感激他们的付出和爱。
                    </p>
                </div>
                <div class="main_right" >我的爱好
                    <p style="margin: 5px 0; word-wrap: break-word; white-space: normal;">
                        我喜欢看电影， especially 《千与千寻》。
                    </p>
                </div>
                <div class="main_right" >我的未来
                    <p style="margin: 5px 0; word-wrap: break-word; white-space: normal;">
                        未来，我将继续努力，以我的努力和爱，为世界带来更多的美好。
                    </p>
                </div>
            </div>
        </div>
    </div>
</body>
</html>